<template>
	<view>
		<uni-nav-bar title="关注"></uni-nav-bar>
		<view class="index">
			<view class="left">
				<block v-for="(item, index) in content_products_info" :key="index" class="itemlist">
					<view class="card" @click="goDetail(item)" v-if="index%2==0">
						<image class="card-img" :src="item.img_url" mode="widthFix"></image>
						<text class="card-num-view">10P</text>
						<view class="card-bottm row">
							<view class="car-title-view row">
								<text class="card-title">{{item.title}}</text>
							</view>
							<view @click.stop="share(item)" class="card-share-view"></view>
						</view>
					</view>
				</block>
			</view>

			<view class="right">
				<block v-for="(item, index) in content_products_info" :key="index" class="itemlist">
					<view class="card" @click="goDetail(item)" v-if="index%2==1">
						<image class="card-img" :src="item.img_url" mode="widthFix"></image>
						<text class="card-num-view">10</text>
						<view class="card-bottm row">
							<view class="car-title-view row">
								<text class="card-title">{{item.title}}</text>
							</view>
							<view @click.stop="share(item)" class="card-share-view"></view>
						</view>
					</view>
				</block>
			</view>
		</view>
	</view>
</template>

<script>
	import uniNavBar from '@/components/uni-nav-bar/uni-nav-bar.vue'
	var _self;
	export default {
		components: {
			uniNavBar
		},
		data() {
			return {
				title: 'Hello',
				content_products_info: []
			}
		},
		onLoad() {
			_self = this;
			uni.startPullDownRefresh();
		},
		onPullDownRefresh() {
			_self.requestData();
		},
		methods: {
			requestData() {
				// 默认方式
				uni.request({
					url: 'http://192.168.0.109:8090/content.action',
					success: (res) => {
						uni.stopPullDownRefresh();
						console.log(res.data.data.content_products_info);
						_self.content_products_info = res.data.data.content_products_info;
					}
				});
			}
		}
	}
</script>

<style>
	.content {
		text-align: center;
		height: 400upx;
		margin-top: 200upx;
	}

	.left,
	.right {
		display: inline-block;
		vertical-align: top;
		width: 49%;
	}

	.itemlist {
		background-color: #fff;
		margin: 1%;
		margin-bottom: 20rpx;
		display: inline-block;

	}
</style>
